<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

<body id="">
<script src="vue.js"></script>
<div id="main_div">
 
  <p>
    <label for="textfield">用户名:</label>
    <!--avalue="obj1.用户名"-->
     {{obj1.用户名}}
  </p>
  <p>
    <label for="textfield2">备注:</label>
	 {{obj1.备注}}     
  </p>
  <p>
 
  </p>
  <p>...........</p>
  <p>
     
  </p>
 </div>
<script>
//建立vue与容器元素的绑定关系，同时设置初始值为空[]
//el就是容器元素 id
//obj1 是自定义的数据对象
var   VueObj1 =  new Vue({
          el: '#main_div',
      	  data: {
			obj1:{}
          
          }
   });
   
   //获取数据，一般是从ajax从后端获取数据  
     var json_from_ajax= {用户名:"王一",备注:"管理员",selectedProp:3};
  	//将数据绑定到 控件  这里就是容器元素
    VueObj1.$data.obj1=json_from_ajax;
	
	function submt()
	{
	 console.log( VueObj1.$data.obj1 );
	}
</script>
</body>
</html>
